import { Component } from 'react';
import ReactDOM from 'react-dom/client';

/* 
  React 调用时 this 指向问题:
    1. 原生JS知识点回顾：sayHi() {} 书写时不能绑定 this 指向，由调用时决定。
    2. 箭头函数，在书写时就绑定 this 的指向。
*/
class App extends Component {
  state = {
    msg: 'hello react',
  };

  // handleClick(){} 写法尽量少用，书写不明确 this 指向
  handleClick() {
    console.log(this); // ❌ this 指向 undefined，不能访问组件实例
  }

  render() {
    return (
      <div>
        <button onClick={this.handleClick}>点我</button>
      </div>
    );
  }
}

ReactDOM.createRoot(document.getElementById('root')).render(<App />);
